
<template>
   <div class="ma">

    <a-row>
      <a-col :span="2" :offset="14">
        <h3>推送信息</h3>
      </a-col>
    </a-row>
    <a-row>
      <a-col :span="8">
        <div class="addressinfo_box">
          <a-row class>
            <a-col :span="3">省：</a-col>
            <a-col :span="10">
              <a-select style="width: 520px">
                <a-select-option
                  v-for="item in shenglist"
                  :key="item.id"
                  @click="getshi(item.id)"
                >{{ item.name }}</a-select-option>
              </a-select>
            </a-col>
          </a-row>
          <a-row class="erw">
            <a-col :span="3">市：</a-col>
            <a-col :span="10">
              <a-select style="width: 520px">
                <a-select-option
                  v-for="item in shenglist"
                  :key="item.id"
                  @click="getqu(item.id)"
                >{{ item.name }}</a-select-option>
              </a-select>
            </a-col>
          </a-row>
          <a-row class="erw">
            <a-col :span="3">区：</a-col>
            <a-col :span="10">
              <a-select style="width: 520px">
                <a-select-option
                  v-for="item in shenglist"
                  :key="item.id"
                  @click="getjiedao(item.id)"
                >{{ item.name }}</a-select-option>
              </a-select>
            </a-col>
          </a-row>
          <a-row class="erw">
            <a-col :span="3">街道：</a-col>
            <a-col :span="10">
              <a-select style="width: 520px">
                <a-select-option
                  v-for="item in shenglist"
                  :key="item.id"
                  @click="getcitylist(item.id)"
                >{{ item.name }}</a-select-option>
              </a-select>
            </a-col>
          </a-row>
        </div>
      </a-col>
      <a-col :span="9" :offset="2">
        <div class="outinfo_box">
          <a-row>
            <a-input type="textarea" :rows="18" placeholder="请输入内容" v-model="outinfo"></a-input>
          </a-row>
          <a-row>
            <a-col :offset="10">
              <a-button class="btn_outinfo" @click="btn_outinfo">推送信息</a-button>
            </a-col>
          </a-row>
        </div>
      </a-col>
    </a-row>
  </div>
</template>

<script>

export default {
  data() {
    return {
      IDsheng: '',
      IDshi: '',
      IDqu: '',
      IDjiedao: '',
      outinfo: '',
      shenglist: [
        { id: 1, name: 'a' },
        { id: 2, name: 'b' },
        { id: 3, name: 'c' },
        { id: 4, name: 'd' },
        { id: 5, name: 'f' },
        { id: 6, name: 'e' }
      ]
    }
  },
  created() {},
  mounted() {},
  methods: {
    getshi(id) {
      this.IDsheng = id
    },
    getqu(id) {
      this.IDshi = id
    },
    getjiedao(id) {
      this.IDqu = id
    },
    getcitylist(id) {
      this.IDjiedao = id
    },
    btn_outinfo() {
      this.outinfo = ''
    }
  }
}
</script>

<style>
.ma{
  min-height:  calc(100vh - 59px);
  margin: 40px;
}
.row_mationpush_2 {
  margin-top: 40px;
}
.mationpush_logo_box {
  width: 100px;
  height: 100px;
  border: 1px solid black;
}
.mationpush_infopush_box {
  font-size: 20px;
  text-align: center;
  line-height: 100px;
}
.btn_outinfo {
  margin-top: 20px;
}
.a-input-group__prepend {
  width: 40px;
  text-align: center;
}
.erw {
  margin-top: 10px;
}
</style>



